<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>原神卡片生成工具</title>
    <link rel="stylesheet" href="https://static.xmdhs.com/mdui/1.0.2/css/mdui.min.css" />
    <script src="https://static.xmdhs.com/mdui/1.0.2/js/mdui.min.js"></script>
    <script defer src='https://static.cloudflareinsights.com/beacon.min.js'
        data-cf-beacon='{"token": "b288002c53e544a38e68d4ec672b85e8"}'></script>
    <meta name="description" content="原神卡片生成工具" />
</head>

<body>
    <header class="mdui-appbar">
        <div class="mdui-toolbar mdui-color-theme">
            <a href="https://genshin-card.xmdhs.com/" class="mdui-typo-title">genshin-card</a>
            <div class="mdui-toolbar-spacer"></div>
        </div>
    </header>
    <main class="mdui-container mdui-typo" style="padding-top: 25px;">
        <p>能够显示原神的个人信息。</p>
        <p>svg 代码来自 <a href="https://genshin-card.getloli.com/">https://genshin-card.getloli.com/</a> 。</p>
        <p>之所以重新写一遍是因为他这个的 github 仓库被封了，虽然弄到了别人备份的代码，也修改代码让其支持国际服。但是想改成 typescript。改了一点，然后想了想还不如直接用 Go 重写得了。</p>
        <p>目前只支持国际服，也就是亚、欧、美、港澳台服。国服没注册账户没法测试也就没法支持。</p>
        <p>为了避免被 github 封，就干脆不放在 github 上了嘛。</p>
        <h2>演示</h2>
        <div style="display: flex;align-items:baseline;column-gap: 5px;">
            <div class="mdui-textfield mdui-textfield-floating-label">
                <input class="mdui-textfield-input" id="uidinput" type="text" placeholder="UID" />
            </div>
            <button class="mdui-btn mdui-btn-raised" id="uidbutton">生成</button>
        </div>
        <br />
        <img id="uidimg" src="https://genshin-card.xmdhs.com/svg/rand/812924092" />
        <pre>https://genshin-card.xmdhs.com/svg/rand/&lt;UID 游戏界面右下角的那个&gt;
https://genshin-card.xmdhs.com/svg/rand/812924092</pre>

        <p>源码：<a href="https://gitee.com/xmdhs/genshin-card">https://gitee.com/xmdhs/genshin-card</a></p>
        <br />
    </main>
</body>

<script>
    document.querySelector("#uidbutton").addEventListener("click", () => {
        const uid = document.querySelector("#uidinput").value
        if (!uid) return;
        document.querySelector("#uidimg").src = `https://genshin-card.xmdhs.com/svg/rand/${uid}`
    })
</script>

</html>